<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
    <head>
        <title>Rasende Roboter</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
        <script type="text/javascript" src="socket.io/socket.io.js"></script>
        <script type="text/javascript" src="js/libs/jquery-2.0.3.min.js"></script>
        <script type="text/javascript" src="js/login.js"></script>
        <script type="text/javascript" src="js/interface.js"></script>

        <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" />
        <link rel="stylesheet" type="text/css" href="css/bootstrap-responsive.min.css" />
        <link rel="stylesheet" type="text/css" href="css/default.css" />
        <link rel="stylesheet" type="text/css" href="css/login.css" />
    </head>

    <body onload="doAutoLogin();init();">
        <div class="container">
            <div class="page-header">
                <p class="h1"><img src="img/logo-large.png" alt="logo" /></p>
                <p class="h4">Bienvenue sur le site de jeu en ligne</p>
            </div>

            <p class="h3">Démarre le jeu en 3 clics</p>

            <form method="post" action="" id="nouvellePartie" onsubmit="return checkField()">
                <div class="row">
                    <div class="col-lg-4">
                        <p class="h4"><strong>1.</strong> Indique ton login</p>
                    </div>
                    <div class="col-lg-4">
                        <input type="text" class="form-control" placeholder="Login" name="login" id="login" />
                    </div>
                </div>


                <div class="row">
                    <div class="col-lg-4">
                        <p class="h4"><strong>2.</strong> <span id="celluleLabelNouveau">Crée ta partie</span></p>
                    </div>
                    <div class="col-lg-1" id="celluleChoixNouveau" style="display:none">
                        <input type = "radio" name = "choix" id = "choixNouveau" value = "new" checked = "checked" />
                    </div>
                    <div class="col-lg-4" id="celluleNomPartie">
                        <input type="text" class="form-control" placeholder="Nom de la nouvelle partie" id="nouveauNom" onclick="document.getElementById('choixNouveau').checked = true;"/>
                    </div>
                </div>


                <div class="row" id="lignesListeParties" style="display:none">
                    <div class="col-lg-4">
                    </div>
                    <div class="col-lg-1">
                        <input type = "radio" name = "choix" id = "choixExistant"  value = "existant"/>
                    </div>
                    <div class="col-lg-3">
                        <select class="form-control" id="lesParties" name="lesParties" onclick="document.getElementById('choixExistant').checked = true;">
                        </select> 
                    </div>
                </div>

                <!-- Affichage des parties sans fish eye avec une liste box : à conserver pour affichage smartphone (?)         
                         <div class="row" id="lignesListeParties">
                             <div class="col-lg-4">
                             </div>
                             <div class="col-lg-1" id="lignesListeParties">
                                 <input type = "radio" name = "choix" id = "choixExistant"  value = "existant"/>
                             </div>
                             <div class="col-lg-3" style="text-align:center">
                                 <div id="fisheye" class="fisheye">
                                     <div class="fisheyeContainter" id='lesParties'>
                                     </div>
                                 </div> 
                                 <input type="hidden" value="" name="idPartieChoisie" id="idPartieChoisie"/>
                             </div>
                         </div>
                -->       
                <div class="row">
                    <div class="col-lg-4">
                        <p class="h4"><strong>3.</strong> Chauffe tes méninges et lance toi !</p>
                    </div>
                    <div class="col-lg-2">
                        <button class="btn btn-lg btn-primary btn-block" type="submit">Joue</button>
                    </div>
                    <div class="col-lg-2">
                        <button class="btn btn-lg btn-primary btn-block" type="submit" onclick="setDessine()">Dessine</button>
                    </div>
                </div>
                <input type="hidden" value="" name="idGame" id="idGame"/>
                <input type="hidden" value="norm" name="typeAction" id="typeAction"/>
            </form>

            <form hidden="hidden" method="post" action="" id="newplateau" onsubmit="return setPlateau()">
                <div class="modal-footer"></div>
                <div class="row">
                    <div class="col-lg-4">
                        <p class="h4"><strong>1.</strong> Partie en création</p>
                    </div>
                    <div class="col-lg-4">
                        <select class="form-control" id="lesPartiesCustom" name="lesPartiesCustom">
                        </select> 
                    </div>
                </div>

                <div class="row">
                    <div class="col-lg-4">
                        <p class="h4"><strong>2.</strong> Active la palette</p>
                    </div>
                    <div class="col-lg-2">
                        <button class="btn btn-lg btn-primary btn-block" type="submit" onclick="setDessine()">Activer la palette</button>
                    </div>
                </div>
                <input type="hidden" value="" name="idGameTab" id="idGameTab"/>
                <input type="hidden" value="palette" name="typeAction"/>
            </form>
            __FOOTER__
        </div>
    </body>
</html>

